<template>
  <div class="oldstuflist">
    <h2>二手信息</h2>
    <el-tabs type="border-card">
      <el-tab-pane label="发布二手">
        <el-button
          type="text"
          icon="el-icon-plus"
          @click="$router.push('/admin/createoldstuff')"
        >发布二手信息</el-button>
        <el-table :data="tableData" border style="width: 100%">
          <el-table-column prop="createtime" label="日期">
            <template slot-scope="scope">{{scope.row.createtime|dataFormat}}</template>
          </el-table-column>
          <el-table-column prop="oldstuff_name" label="名称"></el-table-column>
          <el-table-column prop="oldstuff_lable" label="分类"></el-table-column>
          <el-table-column prop="oldstuff_price" label="价格"></el-table-column>
          <el-table-column prop="oldstuff_name" label="操作">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="$router.push(`/admin/updateoldstuff/${scope.row.oldstuff_id}`)">编辑</el-button>
              <el-button type="text" size="small" @click="deleteOldStuff(scope.row.oldstuff_id)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :page-sizes="[5, 10, 20,]"
          :page-size="pagelistquery.pagesize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="pagelistquery.total"
        ></el-pagination>
      </el-tab-pane>
      <!--寻找二手信息-->
      <el-tab-pane label="我想要的">
        <el-table :data="joinTableData" border style="width: 100%">
          <el-table-column fixed prop="createtime" label="添加日期">
            <template slot-scope="scope">{{ scope.row.joins_createtime | dataFormat }}</template>
          </el-table-column>
          <el-table-column prop="oldstuff_name" label="名称"></el-table-column>
          <el-table-column prop="oldstuff_price" label="价格"></el-table-column>
          <el-table-column prop="name" label="我的报价"></el-table-column>
          <el-table-column fixed="right" label="操作" width="130">
            <template slot-scope="scope">
              <el-button
                type="text"
                size="small">
                <a style="color:#409eff" target="_blank"
                   :href="`${url}/#/oldstuffcontent/${scope.row.oldstuff_id}` ">查看</a>
              </el-button>
              <el-button type="text" size="small" @click="delJoin(scope.row.join_id)">取消报名</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import { mapState } from 'vuex'
export default {
  name: 'oldstuflist',
  data () {
    return {
      tableData: [],
      pagelistquery: {
        total: 0,
        pagesize: 10,
        page: 1
      },
      joinTableData: []
    }
  },
  computed: {
    ...mapState(['url'])
  },
  methods: {
    async deleteOldStuff (oldstuffid) {
      const result = await this.$axios.post('/webadmin/deleteoldstuff',
        this.qs.stringify({ oldstuff_id: oldstuffid }))
      if (result.data.state.type === 'SUCCESS') {
        this.$message.success('删除成功')
        this.getOldStuffList()
      }
    },
    async delJoin (id) {
      const result = await this.$axios.post('/webadmin/deletejoin',
        this.qs.stringify({ id: id }))
      if (result.data.state.type === 'SUCCESS') {
        this.$message.success('取消成功')
        this.getOldStuffJoinList()
      }
    },
    handleSizeChange (val) {
      this.pagelistquery.pagesize = val
      this.getOldStuffList()
    },
    handleCurrentChange (val) {
      this.pagelistquery.page = val
      this.getOldStuffList()
    },
    async getOldStuffList () {
      const data = {
        page: this.pagelistquery.page,
        pagesize: this.pagelistquery.pagesize
      }
      const result = await this.$axios.post('/webadmin/getoldstufflist', this.qs.stringify(data))
      if (result.data.state.type === 'SUCCESS') {
        this.tableData = result.data.data
        this.pagelistquery.total = result.data.count
      }
    },
    async getOldStuffJoinList () {
      const result = await this.$axios.post('/webadmin/joinslist',
        this.qs.stringify({ type: 'oldstuffcontent' }))
      if (result.data.state.type === 'SUCCESS') {
        this.joinTableData = result.data.data
      }
    }
  },
  created () {
    this.getOldStuffList()
    this.getOldStuffJoinList()
  }
}
</script>

<style scoped>

</style>
